import Fetch from '../modules/fetch'
import Jsonp from 'jsonp'
import {Link} from 'react-router'
import $ from 'jquery'

class Tuijian extends React.Component {   
    constructor(props,context){
        super(props,context)

        this.state={
        	boxList:[]
       	
        }
    }
    componentWillMount(){
    	this.getBoxData()
    }
    
    getBoxData(){
    	let that = this;
//  	https://api.bilibili.com/x/web-interface/ranking?rid=0&day=3&jsonp=jsonp

		Fetch.Get('http://localhost:9000/bilili/x/web-interface/ranking',{
			day:3
		}).then(res=>{return res.json()}).then(json=>{
					
						that.setState({boxList:json.data.list})
      })
    }
    
    showBoxWords(){
        let that = this
		let str = ''
		let arr = []
        	this.state.boxList.forEach((item,i)=>{
        		let _src = item.pic.replace("http","https")

        		if(i<10){
                    
       			
					arr.push(			
							<Link to={"/tuijianfly/"+item.aid} >
							<div className='tuijian__box'>
			    				<span className='tuijian__box__num'>{i+1}</span>				
								<img src={_src+'@339w_212h.webp'}  className='tuijian__box__pic'/>
								<div className='tuijian__box__main'>
									<p>{item.title}</p>
									<p>作者----{item.author}</p>
									<p>播放数----{item.play}</p>
								</div>
								
							</div>
							</Link>

						)		  
					
        		}
         
	        })

			return arr;
    }
    
    changeTowhat(){
		$(location).attr('href', '#/reg');
	}
     changeTowhat2(){
		$(location).attr('href', '#/');
	}
      changeTowhat3(){

	}
    
    render(){

        return (     
        		<div>
	        		<div className="header-swipper">		
						<div className="header-top">
				    		<img src="./lib/images/logo.png" alt="" className="header-top__logo" onClick={this.changeTowhat2}/>
				    		推荐
				    		<div className="header-top__right">
				    			<img src="./lib/images/tv_icon.gif" alt="" className="userBox_pic"/>
				    			<p onClick={this.changeTowhat}>注册</p>
				    		</div>
				    	</div>
					</div>
	        		<div className='aaa'>        			
	        			{this.showBoxWords()}
	        		</div>
        		</div>
        )
    }
    componentDidUpdate() {

        $(".tuijian__box__pic").each((index, item)=>{
            $(item).on("error", ()=>{
                $(item).attr("src", "./lib/images/403.png")
            })
        })
    }
}
//定义默认属性
Tuijian.defaultProps={

}



export default Tuijian